---
layout: blank
hide-in-nav: true
---
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>行测常用数据 | Chase</title>
  <style>
    *,
    html,
    body {
      padding: 0;
      margin: 0;
      user-select: none;
    }

    html,
    body,
    main {
      width: 100%;
      height: 100%;
      user-select: none;
    }

    .shadow {
      box-shadow: 0px 0px 50px rgba(0, 0, 0, .1);
    }

    main {
      display: flex;
      align-items: center;
      justify-content: center;
      flex-direction: column;
    }

    .content-container {
      height: 80%;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      font-size: 48px;
    }

    .content-container span {
      padding: 20px;
    }

    #key {
      color: transparent;
      transition: .3s;
    }

    #see-key {
      border-radius: 20px;
      padding: 20px;
      width: 50%;
      display: flex;
      justify-content: center;
      align-items: center;
      /* background: #ecf0f1; */
      background: white;
      cursor: pointer;
      transition: .3s;
      -webkit-tap-highlight-color: transparent;
    }

    #see-key:active {
      transform: scale(0.95);
      box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
    }

    /* #see-key:hover {
      background-color: #ecf0f1;
    } */
  </style>
</head>

<body>
  <main>
    <div class="content-container">
      <span id="question">⅙</span>
      <span id="key">16.7%</span>
    </div>
    <div id="see-key" class="shadow"><span>K E Y</span></div>
  </main>
</body>
<script>
  let data = [
    // ['⅙', '16.7%'],
    // ['⅐', '14.3%'],
    // ['⅛', '12.5%'],
    // ['⅑', '11.1%'],
    // ['1/11', '9.1%'],
    // ['1/12', '8.3%'],
    // ['1/13', '7.7%'],
    // ['1/14', '7.1%'],
    // ['1/15', '6.7%'],
    // ['1/16', '6.25%'],
    // ['1/17', '5.9%'],
    // ['1/18', '5.6%'],
    // ['1/19', '5.3%'],
    ['16.7%', '⅙'],
    ['14.3%', '⅐'],
    ['12.5%', '⅛'],
    ['11.1%', '⅑'],
    ['9.1%', '1/11'],
    ['8.3%', '1/12'],
    ['7.7%', '1/13'],
    ['7.1%', '1/14'],
    ['6.7%', '1/15'],
    ['6.25%', '1/16'],
    ['5.9%', '1/17'],
    ['5.6%', '1/18'],
    ['5.3%', '1/19'],
    ['16.7%', '⅙'],
    ['14.3%', '⅐'],
    ['12.5%', '⅛'],
    ['11.1%', '⅑'],
    ['3⁶', '729'],
    ['4⁴', '256'],
    ['4⁵', '1024'],
    ['5³', '125'],
    ['9³', '729'],
    ['D1', '0'],
    ['D2', '1'],
    ['D3', '2'],
    ['D4', '9'],
    ['D5', '44']
    // ['如何判断能被一个数字能否被7整除？', '末三位数字与剩下的数字之差能被7整除'],
    // ['1/11', '9.1%'],
    // ['1/12', '8.3%'],
  ];
  let dataIndex = 0;
  let flag = true;
  let btSee = document.getElementById('see-key');
  let spanQuestion = document.getElementById('question');
  let spanKey = document.getElementById('key');

  function getRadonIndex() {
    return Math.floor(Math.random() * data.length);
  }

  function refreshQuestion() {
    spanQuestion.textContent = data[dataIndex][0];
  }

  function refreshKey() {
    spanKey.textContent = data[dataIndex][1];
  }

  btSee.onclick = function () {
    if (flag) {
      spanKey.style.color = 'gray';
      btSee.children[0].textContent = 'N E X T';

      refreshKey();

      flag = !flag;
    } else {
      spanKey.style.color = 'transparent';
      btSee.children[0].textContent = 'K E Y';

      let formerIndex = dataIndex;

      while (dataIndex == formerIndex) {
        dataIndex = getRadonIndex();
      }

      refreshQuestion();

      flag = !flag;
    }
  }
</script>

</html>